<template>
	<view class="page">
		<!-- #ifndef MP-WEIXIN-->
		<my-navbar :leftText="name" @leftClick="back"></my-navbar>
		<!-- #endif -->
		<view class="goods_box">
			<view class="goods" @click="detailPage(index,item.goods_id)" v-for="(item,index) in dataList" :key="index">
				<image class="img" :src="item.img" mode="aspectFit"></image>
				<text class="name">{{item.name}}</text>
				<view class="tags" v-if="item.datum.length>0">
					<view class="tag" v-for="y in item.datum">{{y.title}}</view>
				</view>
				<view class="detail" v-else>
					<text>{{item.describe||''}}</text>
				</view>
				<text v-show="canshowprice" class="unit">¥<text class="price">{{item.showPrice}}<text
							v-if="item.spu.length==1" style="font-size:20rpx;">
							/{{item.spu[0].unit}}</text></text></text>
				<!-- <image class="icon logo" v-if="showLogo==1" :src="logo" mode="aspectFit"></image> -->
				<image @click.stop="showCart(index)" class="icon shop" src="../../static/image/shop.png" mode="">
				</image>
			</view>
			<view class="nodata" v-if="dataList.length==0">
				<image :src="nodataImg" mode="aspectFit"></image>
				<view>空空如也~</view>
			</view>
		</view>
		<my-addcart ref="minicart" :canshowprice="canshowprice"></my-addcart>

	</view>
</template>

<script>
	import {
		$https
	} from '@/static/js/request.js';
	import MixinShowprice from '@/static/js/mixinshowprice.js'
	export default {
		data() {
			return {
				loginVolid: null, //是否强制登录
				logo: '',
				showLogo: 0,
				nodataImg: getApp().globalData.nodataImg,
				dataList: [],
				show: false,
				id: null,
				name: null,
				page: 0,
			};
		},
		mixins: [MixinShowprice],
		onLoad(options) {
			this.loginVolid = !Boolean(uni.getStorageSync('loginVolid').is_login_category);
			console.log(this.loginVolid,'111')
			this.id = options.id;
			this.name = options.name;
			// #ifdef MP-WEIXIN
			uni.setNavigationBarTitle({
				title: options.name
			})
			// #endif
			this.getData(1);
		},
		methods: {
			getData(page) {
				let params = {
					page: page,
					size: 20,
					id: this.id
				}
				$https('GET', 'getGoodsProject', params, res => {
					if (res.data.errcode == 0) {
						this.dataList = this.changePrice(res.data.data.list);
						//是否显示logo
						uni.setStorageSync('showLogo', res.data.data.auto_watermark);
						uni.setStorageSync('logo', res.data.data.site_logo);
						this.showLogo = res.data.data.auto_watermark;
						this.logo = res.data.data.site_logo;
					} else {
						uni.showToast({
							title: res.data.errmsg,
							icon: 'none'
						});
					}
				}, this.loginVolid)
			},
			detailPage(index, id) {
				uni.navigateTo({
					url: `../../pages/index/shopdetail?id=${id}`,
				})
			},
			addToCart(goodsId, spuId, num, index) {
				var options = {
					goods_id: goodsId,
					spu_id: spuId,
					num,
				}
				$https('POSTN', 'changeCart', options, res => {
					if (res.data.errcode == 0) {
						this.dataList[index].willBuyNum = Number(num);
						this.$refs.tabar.changetag(res.data.data.all_cart_num);
					} else {
						uni.showToast({
							title: res.data.errmsg,
							icon: 'none'
						})
					}
				})
			},
			changeDate(data) {
				this.date.start = data.startDate;
				this.date.end = data.endDate;
				let startTime = (new Date(data.startDate) / 1000).toFixed(0);
				let endTime = (new Date(data.endDate) / 1000).toFixed(0);
				this.date.startTime = startTime;
				this.date.endTime = endTime;
				this.getData(startTime, endTime)
			},
			//处理价格规格sku
			changePrice(data) {
				var array = JSON.parse(JSON.stringify(data));
				for (let i in array) {
					//算出价格范围
					if (array[i].spu.length > 1) {
						var min, max;
						min = array[i].spu[0].market_price;
						if (array[i].spu[1].market_price < min) {
							max = Number(array[i].spu[0].market_price);
							min = Number(array[i].spu[1].market_price);
						} else {
							max = Number(array[i].spu[1].market_price);
							min = Number(array[i].spu[0].market_price);
						}
						for (let y in array[i].spu) {
							if (Number(array[i].spu[y].market_price) < min) {
								min = Number(array[i].spu[y].market_price)
							} else if (Number(array[i].spu[y].market_price) > max) {
								max = Number(array[i].spu[y].market_price);
							}
						}
						array[i].showPrice = `${min.toFixed(2)}~${max.toFixed(2)}`;
					} else if (array[i].spu.length == 1) {
						//只有一个规格时显示起订量、库存
						array[i].showPrice = array[i].spu[0].market_price;
						array[i].minimum = array[i].spu[0].minimum;
						array[i].designated_inventory = array[i].spu[0].designated_inventory
						array[i].inventory_left = array[i].spu[0].inventory_left;
					}
					array[i].willBuyNum = array[i].num_cart_count;
				}
				return array;
			},
			//显示小购物车
			showCart(index) {
				var data = this.dataList[index];
				console.log(data)
				this.$refs.minicart.open(data)
			},
			back() {
				// #ifdef H5
				window.history.back(-1);
				// #endif 
				// #ifndef H5
				uni.navigateBack();
				// #endif
			},
		}
	}
</script>

<style lang="scss">
	/deep/.u-drawer {
		overflow: unset !important;
	}

	.page {
		.search_box {
			box-sizing: border-box;
			padding: 0 50rpx;
			background: #F0F1F3;
			border-radius: 40rpx;
			color: #B7B8BA;
			height: 80rpx;
			width: 684rpx;
			margin: 20rpx auto 0;
			display: flex;
			align-items: center;

			.search_input {
				margin-left: 18rpx;
				color: #999;
			}
		}

		.goods_box {
			overflow: hidden;
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			padding: 20rpx 30rpx;

			.goods {
				float: left;
				position: relative;
				display: flex;
				flex-direction: column;
				align-items: center;
				background: #fff;
				border-radius: 10rpx;
				width: 326rpx;
				height: 268rpx;
				box-sizing: border-box;
				padding: 12rpx 0;
				margin-bottom: 30rpx;

				.img {
					height: 92rpx;
				}

				.name {
					font-size: 32rpx;
					color: #191919;
					margin: 14rpx 0 10rpx;
					font-weight: bold;
				}

				.tags {
					display: flex;

					.tag {
						padding: 0 12rpx;
						// transform: scale(.8);
						background: #E84B4B;
						color: #fff;
						border-radius: 6rpx;
						font-size: 20rpx;
						margin-left: 12rpx;
					}
				}

				.detail {
					height: 36rpx;
					font-size: 24rpx;
					padding: 0 10rpx;
					box-sizing: border-box;
					text-align: center;
					color: #ccc;
					width: 100%;
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
				}

				.unit {
					margin: 5rpx 0;
					color: #E84B4B;
					font-size: 20rpx;

					.price {
						font-size: 28rpx;
					}
				}

				.icon {
					position: absolute;
					z-index: 1;
					top: 12rpx;

					&.logo {
						width: 80rpx;
						left: 14rpx;
					}

					&.shop {
						width: 38rpx;
						height: 38rpx;
						right: 14rpx;
					}
				}
			}

		}

		/deep/.u-calendar {
			background: #fff;

			.u-calendar__header__text {
				padding-top: 32rpx;
				margin-top: 0;
			}
		}
	}
</style>
